import { useEffect, useState } from "react";
import { getHttp } from "../../../api";
import { useAppSelector } from "../../../store/hooks";
import { useNavigate, useParams } from "react-router-dom";
import style from "./steyle.module.scss";
import bg from "../../../assets/images/image/hdpi/user_bg.png";
import myheight from "../../../assets/images/icon/hdpi/my_icon_height_n.png";
import myweight from "../../../assets/images/icon/hdpi/my_icon_weight_n.png";
import myage from "../../../assets/images/icon/hdpi/my_icon_age_n.png";
import bor from "../../../assets/images/icon/hdpi/common_icon_boy_n.png";
import girl from "../../../assets/images/icon/hdpi/common_icon_girl_n.png";
import { MyNavBar, MyTagdisease } from "../../../components";
import { dateFormat } from "../../../utils/formatTime";
interface IConsultationInfo {
  age: number;
  diseaseBefore: string;
  diseaseMain: string;
  diseaseNow: string;
  height: number;
  nickName: string;
  picture: string;
  sex: number;
  treatmentEndTime: number;
  treatmentHospitalRecent: string;
  treatmentProcess: string;
  treatmentStartTime: number;
  userHeadPic: string;
  userId: number;
  weight: number;
}
const Index: React.FC = () => {
  const doctorId = useAppSelector((state) => state.user.doctor.doctorId);
  const sessionId = useAppSelector((state) => state.user.doctor.sessionId);
  const { userId } = useParams();
  const [UserInfo, setUserInfo] = useState<IConsultationInfo>(
    {} as IConsultationInfo
  );
  const navigate = useNavigate();
  // 获取医生信息
  const getfindUserInfo = async () => {
    const resq = await getHttp(
      "/health/doctor/inquiry/verify/v1/findUserInfo",
      { userId },
      { doctorId, sessionId }
    );
    console.log(resq.result);

    setUserInfo(resq.result);
  };
  useEffect(() => {
    getfindUserInfo();
  }, []);
  return (
    <div>
      <div
        className={style.login}
        style={{ backgroundImage: `url(${UserInfo.picture})` }}
      ></div>
      <div className={style.personal}>
        <img className={style.img} src={UserInfo.userHeadPic} alt="" />
        <img
          src={UserInfo.sex === 1 ? bor : girl}
          alt=""
          className={style.imgicon}
        />
        <p>{UserInfo.nickName}</p>
      </div>
      <div className={style.myinfo}>
        <dl>
          <dt>{UserInfo.height}cm</dt>
          <dd>
            <img src={myheight} alt="" />
          </dd>
        </dl>
        <dl>
          <dt>{UserInfo.weight}Kg</dt>
          <dd>
            <img src={myweight} alt="" />
          </dd>
        </dl>
        <dl>
          <dt>{UserInfo.age}岁</dt>
          <dd>
            <img src={myage} alt="" />
          </dd>
        </dl>
      </div>
      <MyTagdisease title="主要病症" disease={UserInfo.diseaseMain} />
      <MyTagdisease title="现病史" disease={UserInfo.diseaseNow} />
      <MyTagdisease title="既往病史" disease={UserInfo.diseaseBefore} />
      <MyTagdisease title="既往病史" disease={UserInfo.diseaseBefore} />
      <MyTagdisease
        title="最近一次治疗进度"
        disease={UserInfo.treatmentProcess}
        treatmentHospital={UserInfo.treatmentHospitalRecent}
        timer={`${dateFormat(
          UserInfo.treatmentStartTime,
          "yyyy.MM.dd"
        )}-${dateFormat(UserInfo.treatmentEndTime, "MM.dd")}`}
      />
      <MyTagdisease title="相关图片" picture={UserInfo.picture} />
    </div>
  );
};

export default Index;
